<script>
import normal from "./components/normal.vue"
import daiBei from "./components/daiBei.vue"
import websocket from "@/utils/websocket"
import { cloneDeep, getShowImage, handleUrlParams } from "@/utils"
import store from "@/store"
import { vocabularyLearningActionType } from "@/store/modules/vocabularyLearning"
import { userActionType } from "@/store/modules/user"
import request from "@/utils/request"
import studyRoomFloat from "@/components/studyRoomFloat/index.vue"
import urlUtils from "@/utils/urlUtils"

export default {
  components: { normal, daiBei, studyRoomFloat },
  data() {
    return {
      thesaurusId: "", // 参数带过来的词库id
      thesaurusDetail: null, // 词库详情
    }
  },
  computed: {
    getComponentInstanceRef() {
      if (!this.planInfo) return ""
      // 带背词库
      if (this.planInfo.thesaurusCategory === "Racked") {
        return "daiBei"
        // 常规词库
      } else if (this.planInfo.thesaurusCategory === "Routine") {
        return "normal"
      }
    },
    userSelectExamId: () => store.getters[userActionType.getters.userSelectExamId],
    planInfo: () => store.getters[vocabularyLearningActionType.getters.planInfo],
  },
  onLoad(query) {
    this.thesaurusId = query.thesaurusId
  },
  async onShow() {
    websocket.trackCurrentPage("单词打卡计划").catch(() => {})
    if (!this.userSelectExamId) {
      await store.dispatch(userActionType.action.examInfo)
    }
    //获取用户和创建的学习计划
    // 参数带有词库id（分享进来）
    // 检查考试是否匹配
    if (this.thesaurusId) {
      this.thesaurusDetail = await request({
        url: "thesaurus/getDetailsById",
        data: {
          thesaurusId: this.thesaurusId,
        },
        showLoading: true,
        errorHandle: true,
      })
      if (!this.userSelectExamId || this.userSelectExamId.toString() !== this.thesaurusDetail.examId.toString()) {
        try {
          // 自动切换到对应的考试
          await request({
            url: "exam/saveUserSelectExam",
            data: {
              examId: this.thesaurusDetail.examId,
            },
            showLoading: true,
          })
          await store.dispatch(userActionType.action.refreshUserInfo)
          // 重新获取考试
          await store.dispatch(userActionType.action.examInfo)
        } catch (e) {
          console.log(e, "error")
        }
      }
      //检查是否存在相同词汇的计划
      let boolean = await request({
        url: "userCheckPlan/existPlan",
        data: {
          examId: this.userSelectExamId,
          thesaurusId: this.thesaurusDetail.thesaurusId,
        },
        errorHandle: true,
        showLoading: true,
      })
      //不存在计划跳转到添加计划界面
      if (!boolean) {
        store.commit(vocabularyLearningActionType.mutations.vocabularyDetail, this.thesaurusDetail)
        uni.redirectTo({
          url: "/vocabulary/pages/makeLearningPlan/addPlan",
        })
        return
      }
    }
    // 获取计划信息
    await store.dispatch(vocabularyLearningActionType.actions.planInfo)
    this.$nextTick(() => {
      const instance = this.$refs[this.getComponentInstanceRef]
      instance.setPlanInfo(this.planInfo)
      instance.onPageShow && instance.onPageShow()
    })
  },
  // 配置右上角分享
  async onShareAppMessage() {
    const page = urlUtils.parseUrl(urlUtils.getCurrentPageUrl())
    return {
      title: this.planInfo.shareTitle ? this.planInfo.shareTitle : this.planInfo.thesaurusName,
      imageUrl: getShowImage(this.planInfo.sharePoster ? this.planInfo.sharePoster : this.planInfo.thesaurusImg),
      path: handleUrlParams(page.path, {
        ...page.query,
        thesaurusId: this.planInfo.thesaurusId,
      }),
    }
  },
}
</script>

<template>
  <view>
    <dai-bei v-if="getComponentInstanceRef === 'daiBei'" ref="daiBei"></dai-bei>
    <normal v-else-if="getComponentInstanceRef === 'normal'" ref="normal"></normal>
    <studyRoomFloat></studyRoomFloat>
  </view>
</template>

<style scoped lang="scss"></style>
